<template>
  <div class='nav'>
    <router-link to='/'> Home</router-link>
    <router-link to='/about'>About </router-link>
  </div>
  <div>
    home vuex -> count : {{ count }}
    <button @click="handleClick">click</button>
  </div>
</template>

<script lang="ts">
import { computed } from 'vue'
import { useStore } from 'vuex'
export default {
  setup() {
    const store = useStore()
    console.log(store)
    const count = computed(() => store.state.count)
    const handleClick = () => {
      store.commit('add')
    }
    return {
      count,
      handleClick,
    }
  },
}
</script>

<style lang="scss">
.nav {
  margin-bottom: 50px;
  a {
    margin-right: 20px;
  }
}

</style>
